<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Cube Effect Slider | Swiper JS and tsParticles</title>
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css">
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css">
		<link rel="stylesheet" href="./swiper.css" />
	</head>
	<body>
		<div id="tsparticles"></div>
		<section>
			<div class="content">
				<h1>Let's Travel The World Together!</h1>
				<p>
					Our tours are designed to transport you to the heart of the world's
					most captivating destinations, creating memories that will last a
					lifetime. You can uncover the hidden gems, iconic landmarks, and
					unique cultural treasures that make each destination special.
				</p>
				<button>Explore Tours</button>
			</div>

			<div class="swiper">
				<div class="swiper-wrapper">
					<div class="swiper-slide">
						<img
							src="https://github.com/ecemgo/mini-samples-great-tricks/assets/13468728/49db1b5f-09f6-4433-be57-51687585600c" />
						<div class="cost">from $230 per group</div>
						<div class="overlay">
							<h1>Walking Tour in Florence</h1>
							<p>
								Discover the fascinating beauty of this historic city by
								strolling through the rich cultural tapestry that makes Florence
								a timeless destination.
							</p>
							<div class="ratings">
								<div class="stars">
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star-half-outline"></ion-icon>
								</div>
								<span>138 reviews</span>
							</div>
						</div>
					</div>
					<div class="swiper-slide">
						<img
							src="https://github.com/ecemgo/mini-samples-great-tricks/assets/13468728/2d165721-fe2e-4cf0-a63e-20bc5bc3f847" />
						<div class="cost">from $380 per group</div>
						<div class="overlay">
							<h1>Edinburgh Guided Tour</h1>
							<p>
								Explore the city's majestic castles and fascinating history by
								joining our guided tour for an unforgettable journey through
								Scotland's capital.
							</p>
							<div class="ratings">
								<div class="stars">
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
								</div>
								<span>307 reviews</span>
							</div>
						</div>
					</div>
					<div class="swiper-slide">
						<img
							src="https://github.com/ecemgo/mini-samples-great-tricks/assets/13468728/d311d1de-7382-4c03-b083-5f7e88458158" />
						<div class="cost dark-text">from $99 per adult</div>
						<div class="overlay">
							<h1>New York Sightseeing Tour</h1>
							<p>
								Experience the energy and excitement of New York City from Times
								Square's dazzling lights to the serene beauty of Central Park.
							</p>
							<div class="ratings">
								<div class="stars">
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star-half-outline"></ion-icon>
								</div>
								<span>1152 reviews</span>
							</div>
						</div>
					</div>
					<div class="swiper-slide">
						<img
							src="https://github.com/ecemgo/mini-samples-great-tricks/assets/13468728/be223a30-52d1-4a0b-8d57-2e52f02e2245" />
						<div class="cost dark-text">from $117 per adult</div>
						<div class="overlay">
							<h1>Japan Panoramic Tours</h1>
							<p>
								Embark on a magical journey through Tokyo by discovering the
								beauty of the city as cherry blossom trees paint the streets in
								hues of pink.
							</p>
							<div class="ratings">
								<div class="stars">
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star"></ion-icon>
									<ion-icon class="star" name="star-outline"></ion-icon>
								</div>
								<span>619 reviews</span>
							</div>
						</div>
					</div>
				</div>
			</div>
		</section>
		<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/tsparticles@1.26.0/dist/tsparticles.min.js"></script>
		<script src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.esm.js"></script>
		<script src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.js"></script>
		<script src="./swiper.js"></script>
	</body>
</html>